<template>
    <el-image :src="url+'?'+date" alt="换一张" style="width: 100%; cursor: pointer" @click="refresh">
        <template #placeholder>
            <div class="tip">
                Loading...
            </div>
        </template>
    </el-image>
</template>

<script>
export default {
    name: 'VCode',
    data() {
        return {
            date: ''
        }
    },
    computed: {
        url() {
            return '/api/captcha'
        }
    },
    methods: {
        refresh() {
            const currentTime = new Date().getTime()
            const randomNumber = Math.floor(Math.random() * 1000)
            this.date = currentTime + randomNumber.toString().padStart(3,'0')
        }
    }
}
</script>

<style scoped>
    .tip{
        background-color: #fff;
        width: 100%;
        height: 100%;
    }
</style>>